<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script src="../../../../../vue2.0/dist/vue.js"></script>
	<style type="text/css">
		.box{
			width: 100px;
			height: 100px;
			background-color:blue;
		}
	</style>
	<body>

		<div id="dv" :class="classValue" >
		             <!--class前面的冒号是v-bind的简写-->
		</div>
	</body>
	<script>
		   var vm=new Vue({
		   	 el:'#dv',
		   	 data:{
		   	 	classValue:'box'   //动态设置class
		   	 }

		   })


//          v-bind的简写可以使用:冒号代替,例如这里设置class的值,div中的class没有使用v-bind:class,而是使用:class,达到和第一个页面一样的效果;
//

	</script>
</html>
